<!doctype html>
<html>
    <head>
        <title>Login...</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <base href="../">
        <link rel="icon" type="image/x-icon" href="favicon.ico"/>
        <link rel="stylesheet" type="text/css" href="static/assets/css/common.min.css"/>
        <link rel="stylesheet" type="text/css" href="static/assets/css/centra.min.css"/>
        <!--[if glt IE8.0]>
        <script type="text/javascript" src="static/addons/respond/respond.min.js"></script>
        <![endif]-->
        <script type="text/javascript" src="static/assets/common.min.js"></script>
        <script type="text/javascript" src="common/conf/default.js"></script>
        <script type="text/javascript" src="common/lang/default.js"></script>
        <style type="text/css">
            .navbar .copy-right a ,
            .navbar .site-links a {
                margin-right : 1em;
            }
            .jumbotron {
                color     : #ccc;
                background: #222;
            }
            @media ( min-width: 768px ) {
                .jumbotron {
                    background: #202222 linear-gradient(
                        -45deg, #202222 15%, #20282f 40%, #202222 40%
                    );
                }
            }
        </style>
    </head>
    <body>
        <div style="width : 100%;">
        <div class="jumbotron deny-dark">
            <div class="container">
                <h1 data-i18n="welcome0">Hello!</h1>
                <p> <span data-i18n="welcome1">Welcome to</span>
                    <span data-i18n="centra.title" style="margin-left: 0.5em;">CORE</span>
                    <span data-i18n="centra.sub.title" style="margin-left: 0.5em;"></span>
                    <span data-i18n="welcome2">. Please login...</span></p>
                <div class="row">
                    <form action="centra/sign/create.act?ab=.errs" data-topple="hsForm" id="sign-in-form" class="col-md-6">
                        <input type="hidden" name="place" value="centra"/>
                        <div class="form-group">
                            <input type="text"     name="username" placeholder="username" value="" class="form-field form-control" data-i18n="" required="required"/>
                        </div>
                        <div class="form-group">
                            <input type="password" name="password" placeholder="password" value="" class="form-field form-control" data-i18n="" required="required"/>
                        </div>
                        <div class="form-group">
                            <div class="input-group">
                                <input type="text" name="captcode" placeholder="captcode" value="" class="form-field form-control" data-i18n="" required="required" autocomplete="off"/>
                                <div class="input-group-addon" style="padding: 0;">
                                    <div style="width: 100px; height: 32px;">
                                        <img src="" alt="" class="hide" title="看不清? 点一下换一个."/>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div>
                            <button type="submit" class="btn btn-primary btn-lg" data-i18n="login">Sign in Now</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
        <nav class="navbar">
            <div class="container">
                <blockquote><p class="clearfix" style="font-size: small;">
                    <span>&copy;&nbsp;</span><span class="copy-right"><script type="text/javascript">document.write(H$(":copy.right"))</script></span>
                    <span>&nbsp;&nbsp;</span><span class="site-links"><script type="text/javascript">document.write(H$(":site.links"))</script></span>
                    <span class="pull-right text-muted">Powered by <a href="power.html" target="_blank">HongsCORE</a></span>
                </p></blockquote>
            </div>
        </nav>
        </div>
        <script type="text/javascript">
            (function($) {
                // 居中
                if (document.body.clientHeight >= document.body.scrollHeight) {
                    document.body.setAttribute("style", "display: flex; align-items: center;" );
                }

                var context = $("#sign-in-form");

                // 表单
                context.on("saveBack", function(ev, rd, md) {
                    var fx = function() {
                        H$('%HsCUID', rd.info.uid);
                        H$('%HsCUST', rd.info.ust);
                        location.replace(hsFixUri(hsGetParam(location.href, "r") || "centra/"));
                    };
                    if (rd.msg) {
                        $.hsWarn( rd.msg, "info", fx );
                    } else {
                        fx();
                    }
                    return false;
                });
                context.on("saveFail", function(ev, rd, md) {
                    md.formBox.find( "img" ).click(  );
                    md.formBox.find("[name=captcode]").val("");
                });

                // 验证
                context.find(".form-group img").click(function() {
                    $(this).attr("src", "common/capt/create.act?h=32&f=666666&_="
                    + Math.random( ));
                });
                context.find("[name=captcode]").focus(function() {
                    var img = $(this).closest(".form-group").find("img");
                    if (img.attr("src") == "" ) {
                        img.attr("class" , "" )
                           .click(  );
                    }
                });
            })(jQuery);
        </script>
    </body>
</html>